import React, { useState } from 'react';
import copy from 'copy-to-clipboard';
import CustomIcon from '@/components/CustomIcon';
import styles from './index.module.css';

interface CopyButtonProps {
  text: string;
  onCopy?: () => void;
}

const ButtonCopy: React.FC<CopyButtonProps> = ({ text, onCopy }) => {
  const [copied, setCopied] = useState(false);

  const handleCopy = () => {
    if (copy(text)) {
      setCopied(true);
      if (onCopy) {
        onCopy();
      }
      setTimeout(() => {
        setCopied(false);
      }, 1500);
    }
  };

  return (
    <>
      {copied ? (
        <CustomIcon type="icon-projectOtrue-line" />
      ) : (
        <CustomIcon
          type="icon-projectOcopy-line"
          size={20}
          onClick={handleCopy}
        />
      )}
    </>
  );
};

export default ButtonCopy;
